@import '~scss/variables';

.ruleContainer {
  background: $light-color01;
  border-radius: 4px;
  padding: 12px;

  .addRuleContainer {
    background: $white;
    padding: 12px 20px;
    border: 1px dashed $light-color06;
    border-radius: 4px;

    span {
      display: block;
      font-size: 12px;
      line-height: 20px;
      color: $dark-color07;

      &:nth-of-type(1) {
        font-weight: 600;
      }

      &:nth-of-type(2) {
        color: $dark-color01;
      }
    }

    &:hover {
      cursor: pointer;
      box-shadow: 0px 4px 8px rgba(36, 46, 66, 0.2);
    }
  }
}
